<%@page import="java.util.List"%>
<%@page import="java.util.Set"%>
<%@page import="java.util.HashSet"%>
<%@page import="java.util.Map"%>
<%@page import="java.util.LinkedHashMap"%>
<%@page import="coba.service.ProvinciaLocalServiceUtil"%>
<%@page import="coba.service.InstitucionLocalServiceUtil"%>
<%@page import="coba.service.ContactoLocalServiceUtil"%>
<%@page import="coba.service.RecorridoLocalServiceUtil"%>
<%@page import="coba.service.ItinerarioLocalServiceUtil"%>
<%@page import="coba.service.ItinerarioRecorridoLocalServiceUtil"%>
<%@page import="coba.model.Provincia"%>
<%@page import="coba.model.Institucion"%>
<%@page import="coba.model.Contacto"%>
<%@page import="coba.model.Recorrido"%>
<%@page import="coba.model.Itinerario"%>
<%@page import="coba.model.ItinerarioRecorrido"%>
<%@page import="coba.service.persistence.ItinerarioRecorridoPK"%>
<%@page import="javax.portlet.PortletURL"%>
<%@page import="com.liferay.portal.util.PortalUtil"%>
<%@page import="javax.portlet.ActionRequest"%>
<%@ taglib uri="http://java.sun.com/portlet_2_0" prefix="portlet" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%@ taglib uri="http://liferay.com/tld/ui" prefix="liferay-ui" %>
<%@ taglib uri="http://liferay.com/tld/aui" prefix="aui" %>

<portlet:defineObjects />

<%
	PortletURL urlList = renderResponse.createRenderURL();
	urlList.setParameter("jspPage","/views/itinerario/list.jsp");

	PortletURL urlItinerarioForm = renderResponse.createActionURL();
	urlItinerarioForm.setParameter(ActionRequest.ACTION_NAME, "itinerarioForm");
	urlItinerarioForm.setParameter("redirectTo", urlList.toString());
	
	List<Recorrido> listRecorrido = RecorridoLocalServiceUtil.findByFechaBaja(null);
	
	Long itinerarioId = renderRequest.getParameter("id") != null &&
			!renderRequest.getParameter("id").trim().equals("") ?
			Long.valueOf(renderRequest.getParameter("id")) :
			null;

	Itinerario itinerario = itinerarioId != null ?
			ItinerarioLocalServiceUtil.getItinerario(itinerarioId) :
			null;
	
	List<ItinerarioRecorrido> listItinerarioRecorrido = itinerarioId != null ?
			ItinerarioRecorridoLocalServiceUtil.getByItinerarioId(itinerarioId) :
			null;
	
	Map<Long, Long> mapComienzoRecorrido = new LinkedHashMap<Long, Long>();
	Map<Long, Long> mapDuracionRecorrido = new LinkedHashMap<Long, Long>();
	
	if (listItinerarioRecorrido != null)
		for (ItinerarioRecorrido itinerarioRecorrido : listItinerarioRecorrido) {
			if (mapComienzoRecorrido.get(itinerarioRecorrido.getRecorridoId()) != null) {
				if (mapComienzoRecorrido.get(itinerarioRecorrido.getRecorridoId()) > itinerarioRecorrido.getHora())
					mapComienzoRecorrido.put(itinerarioRecorrido.getRecorridoId(),
							itinerarioRecorrido.getHora());
				mapDuracionRecorrido.put(itinerarioRecorrido.getRecorridoId(),
						mapDuracionRecorrido.get(itinerarioRecorrido.getRecorridoId()) + 30L);				
			}
			else {
				mapComienzoRecorrido.put(itinerarioRecorrido.getRecorridoId(), itinerarioRecorrido.getHora());
				mapDuracionRecorrido.put(itinerarioRecorrido.getRecorridoId(), 30L);
			}
		}
%>

<script>
	var proximoId = 0

	function selectRecorridoHtml(id) {
		var html = '<label style="display:inline; margin:0 5px 0 20px" for="recorrido_' + id + '">Atractivo</label>'

		html += '<select required style="margin:2px 0 !important" id="recorrido_' + id + '" name="<portlet:namespace />recorrido_' + id + '">'
		html += '<option value=""></option>'
		<% for (Recorrido recorrido : listRecorrido) { %>
			html += '<option value="<%=recorrido.getId()%>"><%=recorrido.getNombre()%></option>'
		<% } %>
		html += '</select>'

		return html
	}

	function selectHoraHtml(id) {
		var html = '<label style="display:inline; margin:0 5px 0 20px" for="hora_' + id + '">Hora</label>'

		html += '<select required style="margin:2px 0 !important" id="hora_' + id + '" name="<portlet:namespace />hora_' + id + '">'
		html += '<option value=""></option>'
		html += '<option value="800">8:00 hs</option>'
		html += '<option value="830">8:30 hs</option>'
		html += '<option value="900">9:00 hs</option>'
		html += '<option value="930">9:30 hs</option>'
		html += '<option value="1000">10:00 hs</option>'
		html += '<option value="1030">10:30 hs</option>'
		html += '<option value="1100">11:00 hs</option>'
		html += '<option value="1130">11:30 hs</option>'
		html += '<option value="1200">12:00 hs</option>'
		html += '<option value="1230">12:30 hs</option>'
		html += '<option value="1300">13:00 hs</option>'
		html += '<option value="1330">13:30 hs</option>'
		html += '<option value="1400">14:00 hs</option>'
		html += '<option value="1430">14:30 hs</option>'
		html += '<option value="1500">15:00 hs</option>'
		html += '<option value="1530">15:30 hs</option>'
		html += '<option value="1600">16:00 hs</option>'
		html += '<option value="1630">16:30 hs</option>'
		html += '<option value="1700">17:00 hs</option>'
		html += '<option value="1730">17:30 hs</option>'
		html += '<option value="1800">18:00 hs</option>'
		html += '</select>'

		return html
	}

	function selectDuracionHtml(id) {
		var html = '<label style="display:inline; margin:0 5px 0 20px" for="duracion_' + id + '">Duraci&oacute;n</label>'

		html += '<select required style="margin:2px 0 !important" id="duracion_' + id + '" name="<portlet:namespace />duracion_' + id + '">'
		html += '<option value=""></option>'
		html += '<option value="30">30 min</option>'
		html += '<option value="60">60 min</option>'
		html += '<option value="90">90 min</option>'
		html += '<option value="120">120 min</option>'
		html += '<option value="150">150 min</option>'
		html += '<option value="180">180 min</option>'
		html += '<option value="210">210 min</option>'
		html += '<option value="240">240 min</option>'
		html += '</select>'

		return html
	}

	function selectRecorrido(id) {
		var html = '<div id="recorridoDiv_' + id + '">'

		html += selectRecorridoHtml(id) + selectHoraHtml(id) + selectDuracionHtml(id)

		html += '&nbsp;'
		html += '<a href="#" onclick="return borrarRecorrido(' + id + ')" class="taglib-icon focus" role="menuitem" tabindex="-1">'
		html += '<img src="/html/themes/control_panel/images/spacer.png" alt="" style="background-image: url(\'/sprite/html/themes/control_panel/images/common/_sprite.png\'); background-position: 50% -1688px; background-repeat: no-repeat; height: 16px; width: 16px;" />'
		html += '<span class="taglib-text-icon">Eliminar</span>'
		html += '</a>'

		html += '</div>'

		return html
	}

	function agregarRecorrido() {
		$('#recorridosDiv').append(selectRecorrido(proximoId++))
		
		return false
	}

	function borrarRecorrido(id) {
		$('#recorridoDiv_' + id).remove()
		
		return false
	}

	/*
	function seleccionarRecorrido(id) {

		if ($('#' + id).is(":checked"))
			$('#divHora_' + id).html(selectHoraHtml(id));
		else
			$('#divHora_' + id).html('');

	}
	*/
	
	function cargarRecorridos() {

		<% if (listItinerarioRecorrido != null)
				for (Long recorridoId : mapComienzoRecorrido.keySet()) { %>
			agregarRecorrido()
			$('#recorrido_' + (proximoId - 1)).val('<%=recorridoId%>')
			$('#hora_' + (proximoId - 1)).val('<%=mapComienzoRecorrido.get(recorridoId)%>')
			$('#duracion_' + (proximoId - 1)).val('<%=mapDuracionRecorrido.get(recorridoId)%>')
		<% } %>

	}

	$(function() {
		cargarRecorridos()
	})
</script>

<div>
	<div class="taglib-header">
		<span class="header-back-to">
			<a class="icon-circle-arrow-left previous-level" href="<%=urlList%>" title="Atr&aacute;s">
				<span class="helper-hidden-accessible"> Atr&aacute;s </span>
			</a>
		</span>
		<h3 class="header-title"><span> Itinerario </span></h3>
	</div>

	<div>
		<form action="<%=urlItinerarioForm %>" method="post">
		
			<input type="hidden" name="<portlet:namespace />id" value="<%=itinerario != null ? itinerario.getId() : ""%>" />

			<div class="form-group">
				<label for="<portlet:namespace />modalidad">Modalidad</label>
				
				<select required class="form-control campo ancho" name="<portlet:namespace />modalidad" id="modalidad">
					<option></option>
					<option <%=itinerario != null && "A".equals(itinerario.getModalidad()) ? "selected" : ""%>>A</option>
					<option <%=itinerario != null && "B".equals(itinerario.getModalidad()) ? "selected" : ""%>>B</option>
					<option <%=itinerario != null && "D".equals(itinerario.getModalidad()) ? "selected" : ""%>>D</option>
				</select>
			</div>

			<div class="form-group">
				<label for="nombre">Nombre</label>
				<input required maxlength="50" type="text" class="form-control campo" name="<portlet:namespace />nombre" id="nombre" value="<%=itinerario != null ? itinerario.getNombre() : ""%>">
			</div>
			
			<div class="form-group">
				<label for="nombre">Nombre corto</label>
				<input required maxlength="20" type="text" class="form-control campo" name="<portlet:namespace />nombreCorto" id="nombreCorto" value="<%=itinerario != null ? itinerario.getNombreCorto() : ""%>">
			</div>

			<div class="form-group">
				<label for="nombre">Descripci&oacute;n</label>
				<input required maxlength="50" type="text" class="form-control campo" name="<portlet:namespace />descripcion" id="descripcion" value="<%=itinerario != null ? itinerario.getDescripcion() : ""%>">
			</div>
			
			<div class="form-group">
				<label for="recorridos">Atractivos</label>
				<div id="recorridosDiv">
				</div>
				<a href="#" onclick="return agregarRecorrido()" class="taglib-icon focus" role="menuitem" tabindex="-1">
					<img src="/html/themes/control_panel/images/spacer.png" alt="" style="background-image: url('/sprite/html/themes/control_panel/images/common/_sprite.png'); background-position: 50% -16px; background-repeat: no-repeat; height: 16px; width: 16px;" />
					<span class="taglib-text-icon">Agregar</span>
				</a>
				
				<%--
				<% for (Recorrido recorrido : listRecorrido) { %>
					<div>
						<input style="margin:0 !important" type="checkbox" name="<portlet:namespace />recorrido_<%=recorrido.getId() %>" id="recorrido_<%=recorrido.getId()%>" onclick="seleccionarRecorrido(this.id)" <%=setRecorridoId.contains(recorrido.getId()) ? "checked" : "" %> />
						<label style="display:inline" for="recorrido_<%=recorrido.getId()%>"><%=recorrido.getNombre() %></label>
						<div style="display:inline" id="divHora_recorrido_<%=recorrido.getId()%>">
							<%
								if (setRecorridoId.contains(recorrido.getId())) {
									ItinerarioRecorridoPK pk = new ItinerarioRecorridoPK(itinerarioId, recorrido.getId());
									ItinerarioRecorrido itinerarioRecorrido = ItinerarioRecorridoLocalServiceUtil.getItinerarioRecorrido(pk);
									long hora = itinerarioRecorrido.getHora();
							%>
								<script>
									document.write(selectHoraHtml('recorrido_<%=recorrido.getId()%>'))
									$('#hora_recorrido_<%=recorrido.getId()%>').val(<%=hora%>)
								</script>
							<%
								}
							%>
						</div>
					</div>
				<% } %>
				 --%>
			</div>

			<div class="form-group">
				<label for="dias">D&iacute;as</label>
					<div>
						<input style="margin:0 !important" type="checkbox" name="<portlet:namespace />dia_1" id="dia_lunes" <%=itinerario != null && itinerario.getDiasSemana().contains("1") ? "checked" : "" %> />
						<label style="display:inline" for="dia_lunes">Lunes</label>
					</div>
					<div>
						<input style="margin:0 !important" type="checkbox" name="<portlet:namespace />dia_2" id="dia_martes" <%=itinerario != null && itinerario.getDiasSemana().contains("2") ? "checked" : "" %> />
						<label style="display:inline" for="dia_lunes">Martes</label>
					</div>
					<div>
						<input style="margin:0 !important" type="checkbox" name="<portlet:namespace />dia_3" id="dia_miercoles" <%=itinerario != null && itinerario.getDiasSemana().contains("3") ? "checked" : "" %> />
						<label style="display:inline" for="dia_lunes">Mi&eacute;rcoles</label>
					</div>
					<div>
						<input style="margin:0 !important" type="checkbox" name="<portlet:namespace />dia_4" id="dia_jueves" <%=itinerario != null && itinerario.getDiasSemana().contains("4") ? "checked" : "" %> />
						<label style="display:inline" for="dia_lunes">Jueves</label>
					</div>
					<div>
						<input style="margin:0 !important" type="checkbox" name="<portlet:namespace />dia_5" id="dia_viernes" <%=itinerario != null && itinerario.getDiasSemana().contains("5") ? "checked" : "" %> />
						<label style="display:inline" for="dia_lunes">Viernes</label>
					</div>
					<div>
						<input style="margin:0 !important" type="checkbox" name="<portlet:namespace />dia_6" id="dia_sabado" <%=itinerario != null && itinerario.getDiasSemana().contains("6") ? "checked" : "" %> />
						<label style="display:inline" for="dia_lunes">S&aacute;bado</label>
					</div>
			</div>

			<div>
				<button type="submit" class="btn btn-primary">Aceptar</button>
			</div>
		</form>
	</div>	
</div>
